<!-- include tpl=header menutitle=$page_rs.title -->
<script type="text/javascript" src="//cdn.phpok.com/flv/flv.min.js"></script>

<script type="text/javascript">
var vid;
var lock = false;
var player = null;
var mediaDataSource = {
	'type': 'flv',
	'isLive':true,
	'withCredentials':false,
	'hasAudio':false,
	'hasVideo':true
}
function openSound()
{
	vid.muted = false;
}
function closeSound()
{
	vid.muted = true;
}
function startPlay()
{
	vid.play();
}
function pausePlay()
{
	vid.pause();
}
function vlive2vod()
{
	if(lock){
		return false;
	}
	lock = true;
	$.phpok.json(api_plugin_url('oklive','vlive2vod','tid={$rs.id}'),function(rs){
		if(!rs.status){
			$.dialog.alert(rs.info);
			return false;
		}
		$.phpok.reload();
	});
}
function statView()
{
	//var url = 
}
</script>
<section class="bg-light p-5"{if $cate_rs.banner || $page_rs.banner} style="background:url('{$cate_rs.banner ? $cate_rs.banner.filename : $page_rs.banner.filename}') center center no-repeat;background-size:cover;"{/if}>
	<h1 class="p-4 text-center">{$rs.title}</h1>
	<div class="container">
		<div class="text-center d-block m-4">
			<span class="p-2 bg-light-50 rounded-lg ">
				发布日期：{func time_format $rs.dateline} &nbsp; &nbsp;
				浏览次数：{$rs.hits}
			</span>
		</div>
		<!-- if $rs.tag -->
		<div class="text-center m-3">
			<span class="p-2 bg-light-50 rounded-lg">
			标签：
			<!-- loop from=$rs.tag key=$k value=$v id=$idxx -->
			{$v.html}<!-- if $idxx.total != $idxx.num -->，<!-- /if -->
			<!-- /loop -->
			</span>
		</div>
		<!-- /if -->
	</div>
</section>
<section class="container"><div class="mt-3"><!-- include tpl=block/breadcrumb --></div></section>
<section class="container">
	<div class="mb-4">
		<!-- if $rs.vtype == 'vod' && $rs.video -->
		<div style="width:100%;height:675px;">
			<video type="video/mp4" id="vod" src="{$rs.video}"{if $rs.bg} poster="{$rs.bg}"{/if}{if $rs.ismove} controls="controls"{/if} style="width:100%;height:100%;">不支持这个格式</video>
		</div>
		<!-- if !$rs.ismove -->
		<input type="button" value="开声音" class="btn btn-primary btn-sm" onclick="openSound(this)" />
		<input type="button" value="关声音" class="btn btn-danger btn-sm" onclick="closeSound(this)" />
		<input type="button" value="开始播放" class="btn btn-primary btn-sm" onclick="startPlay(this)" />
		<input type="button" value="暂停播放" class="btn btn-danger btn-sm" onclick="pausePlay(this)" />
		<!-- /if -->
		<script type="text/javascript">
		$(document).ready(function(){
			vid = document.getElementById("vod");
		});
		</script>
		<!-- /if -->
		<!-- if $rs.vtype == 'link' && $rs.link -->
			<!-- php:$video = phpok_video_url($rs.link,'html') -->
			<div style="width:100%;height:675px;">{$video}</div>
		<!-- /if -->
		<!-- if $rs.vtype == 'vlive' && $rs.video -->
		<div style="width:100%;height:675px;">
			<video type="video/mp4" id="vlive" muted="muted" data-livetime="{$rs.livetime}" src="{$rs.video}"{if $rs.bg} poster="{$sys.url}{$rs.bg}"{/if} style="width:100%;height:100%;">不支持这个格式</video>
		</div>
		<input type="button" value="开声音" class="btn btn-primary btn-sm" onclick="openSound(this)" />
		<input type="button" value="关声音" class="btn btn-danger btn-sm" onclick="closeSound(this)" />
		<script type="text/javascript">
		$(document).ready(function(){
			vid = document.getElementById("vlive");
			var t = $("#vlive").attr("data-livetime");
			var n = "{$sys.time}";
			var is_toVod = "{$rs.tovod}";
			setTimeout(function(){
				var start = parseInt(n) - parseInt(t);
				if(start>0){
					if(start>vid.duration){
						//检测是否进入点播模式
						if(is_toVod == 1){
							$.dialog.tips('直播已结束，请稍候，正在转向点播');
							vlive2vod();
							return false;
						}
						$.dialog.alert('直播已结束');
						return false;
					}else{
						vid.currentTime = start;
						vid.play();
					}
				}else{
					vid.play();
				}
			}, 1000);
			vid.ontimeupdate = function(e) {
				if(vid.currentTime >= vid.duration){
					$.dialog.tips('直播已结束，请稍候，正在转向点播');
					vlive2vod();
				}
			};
		});
		</script>
		<!-- /if -->
		<!-- if $rs.vtype == 'live' -->
			<!-- if $rs.livetime > $sys.time -->
			<div style="text-align:center;padding:30px;">直播将在 <span id="timeout" style="color:red;font-size:1.2em;"></span> 后开始</div>
			<script type="text/javascript">
			function TimeDown(id, value) {
				//倒计时的总秒数
				var totalSeconds = parseInt(value / 1000);
				//取模（余数）
				var modulo = totalSeconds % (60 * 60 * 24);
				//小时数
				var hours = Math.floor(modulo / (60 * 60));
				modulo = modulo % (60 * 60);
				//分钟
				var minutes = Math.floor(modulo / 60);
				//秒
				var seconds = modulo % 60;
				hours = hours.toString().length == 1 ? '0' + hours : hours;
				minutes = minutes.toString().length == 1 ? '0' + minutes : minutes;
				seconds = seconds.toString().length == 1 ? '0' + seconds : seconds;
				//输出到页面
				document.getElementById(id).innerHTML = hours + " 小时 " + minutes + " 分 " + seconds+" 秒";
				//延迟一秒执行自己
				if (hours == "00" && minutes == "00" && parseInt(seconds) - 1 < 0) {
					$.phpok.reload();
				} else {
					setTimeout(function() {
						TimeDown(id, value - 1000);
					}, 1000)
				}
			}
			$(document).ready(function(){
				TimeDown("timeout",parseInt(parseInt("{$rs.livetime}") - parseInt("{$sys.time}"))*1000);
			});
			</script>
			<!-- else -->
			<div style="width:100%;height:675px;">
				<video name="live" id="live" muted="muted" data-livetime="{$rs.livetime}"{if $rs.bg} poster="{$sys.url}{$rs.bg}"{/if} autoplay style="width:100%;height:100%;"></video>
			</div>
			<script type="text/javascript">
			$(document).ready(function(){
				vid = document.getElementById("live");
				if (player != null) {
					player.unload();
					player.detachMediaElement();
					player.destroy();
					player = null;
				}
				mediaDataSource['url'] = "{$rtmp.pull_flv}";
				player = flvjs.createPlayer(mediaDataSource, {
					enableWorker: false,
					lazyLoadMaxDuration: 3 * 60,
					seekType: 'range',
				});
				player.attachMediaElement(vid);
				player.load();
			});
			</script>
			<!-- /if -->
		<!-- /if -->

		<!-- if $rs.content -->
		<div class="content">{$rs.content}</div>
		<!-- /if -->
	</div>
</section>
<!-- include tpl=footer -->
